{% extends 'manage/base_manage.html' %}
{% load static %}
{% block title %}系统设置列表{% endblock %}

{% block css %}
    <link rel="stylesheet" href="{% static 'css/set/set_manage.css' %}">
{% endblock %}

{% block content %}
    <div class="content">
        <div id="test_content">
            <div id="test_list">
                <a id="title_distance" href="{% url 'atp:set_manage' %}">公共设置</a>
                <a id="title_distance" href="{% url 'atp:set_user_manage' %}">用户管理</a>
            </div>
            <h3 id="add_test_name">公共设置列表</h3>
            <a id="add_test" href="{% url 'atp:set_add' %}">＋添加公共设置</a>
            <form id="" method="post" action="">
                {% csrf_token %}
                <table class="table-striped" id="table_list">
                    <thead>
                    <tr id="tr_title">
                        <th id="table_title_length">ID</th>
                        <th id="table_title_length2">设置名称</th>
                        <th id="table_title_length2">设置值</th>
                        <th id="table_title_length">编辑</th>
                        <th id="table_title_length">删除</th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for set in sets %}
                        <tr id="tr_d">
                            <td>{{ set.id }}</td>
                            <td>{{ set.set_name }}</td>
                            <td>{{ set.set_value }}</td>
                            <td>
                                <a style="color: cadetblue"
                                   href="{% url 'atp:set_update' set.id %}">编辑</a>
                            </td>
                            <td><a style="color: #cc0000"
                                   href="javascript:" onclick="btn_delete({{ set.id }})">删除</a></td>
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </form>
            <!--分页-->
            <div id="pager">
                <nav aria-label="Page navigation">
                    <ul class="pagination">
                        {% if sets.has_previous %}
                            <li>
                                <a href="?page={{ sets.previous_page_number }}&search_name={{ search_name }}"
                                   aria-label="Previous">
                                    <span aria-hidden="true">&laquo;</span>
                                </a>
                            </li>
                        {% else %}
                            <li class="disabled">
                                <a href="#" aria-label="Next">
                                    <span aria-hidden="true">&raquo;</span>
                                </a>
                            </li>
                        {% endif %}

                        {% for page_index in sets.paginator.page_range %}
                            {% ifequal page_index  sets.number %}
                                <li class="active">
                                    <a style="background: cadetblue"
                                       href="?page={{ page_index }}">{{ page_index }}</a>
                                </li>
                            {% else %}
                                <li>
                                    <a href="?page={{ page_index }}">{{ page_index }}</a>
                                </li>
                            {% endifequal %}
                        {% endfor %}

                        {% if sets.has_next %}
                            <li>
                                <a href="?page={{ sets.next_page_number }}&search_name={{ search_name }}"
                                   aria-label="Next">
                                    <span aria-hidden="true">&raquo;</span>
                                </a>
                            </li>
                        {% else %}
                            <li class="disabled">
                                <a href="#" aria-label="Next">
                                    <span aria-hidden="true">&raquo;</span>
                                </a>
                            </li>
                        {% endif %}
                    </ul>
                </nav>
            </div>
        </div>
    </div>
{% endblock %}

{% block js %}
    <script>
        toastr.options = {
            closeButton: true,
            timeOut: "500",
            positionClass: "toast-center-center",
        };

        function btn_delete(set_id) {
            layer.open({
                title: "是否确认删除?",
                btn: ['确定', '取消'],
                yes: function () {
                    $.ajax({
                        url: "{% url 'atp:set_delete' %}",
                        type: "GET",
                        dataType: "JSON",
                        data: {"set_id": set_id},
                        success: function (res) {
                            if (res.code === 200) {
                                layer.msg('删除成功');
                                setTimeout(function () {
                                    parent.location.reload();
                                }, 1000);
                            } else if (res.code === 201) {
                                toastr.success('删除失败');
                                setTimeout(function () {
                                    parent.location.reload();
                                }, 1000);
                            }
                        }
                    })
                }
            })
        }
    </script>
{% endblock %}